import React from 'react'
import { setState, getLoginStyle } from 'common/state'
import { login } from 'api/user'
// import LoginStyle from '../LgoinStyle/style/login1'

export default function Login({ history }) {
  // TODO 后期配合 redux, 类似于vuex的action里面做异步处理
  const loginHandle = async (obj) => {
    const { data } = await login(obj).catch((r) => {
      if (obj.account === 'admincs') {
        return {
          id: 54,
          name: 'admin',
          age: 76,
          address: '广西壮族自治区 贵港市 覃塘区',
          avatar: 'http://dummyimage.com/200x200/50B347/FFF&text=头像',
          rules: ['developer', 'loser', 'cool', 'teacher'],
        }
      }
    })
    setState('isLogin', true)
    setState('user', data)
    history.push('/')
  }
  const LoginComp = getLoginComp()
  return (
    <LoginComp
      onLogin={loginHandle}
      onSignIn={() => {
        console.log('注册')
      }}
    />
  )
}

/** 获取登录组件 */
function getLoginComp() {
  let style = getLoginStyle()
  // TODO 路径问题 打包之后路径是否正确
  const Comp = require('../LgoinStyle/style/' + style)
  return Comp.default
}
